<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>个人中心</title>
		<link rel="stylesheet" type="text/css" href="css/style_register.css" />
		<SCRIPT language="javascript" src="js/jquery-3.1.1.js" type="text/javascript"></SCRIPT>
		<SCRIPT language="javascript" src="js/md5.js" type="text/javascript"></SCRIPT>
		<SCRIPT language="javascript" src="js/base.js" type="text/javascript"></SCRIPT>
	</head>

	<body>
		<!--header===================================-->
		<header>
			<h1><a href="#"><img src="img/Backicon.png"></a></h1>

			<div class="header_middle">
				个人中心
			</div>
			<div class="header_right">
			</div>
		</header>

		<!--main=======================================-->
		<section id="main">
			<form action="#">
				<div>
					<input type="text" id="signName" value="" name="mp" required placeholder="输入手机号" />
				</div>
				<div>
					<input type="password" id="password" value="" name="password" required placeholder="输入密码" />
				</div>
				<div class="div_button">
					<button onclick="return onSignInClick()">点击登录</button>
					<button>点击注册</button>
				</div>
				<div>
					<button>刷脸登录</button>
				</div>
			</form>
		</section>

	</body>
	<script>
		function onSignInClick() {
			let signName = document.getElementById("signName").value;
			let password = document.getElementById("password").value;
			let jsonData = {};
			jsonData.signName = signName;
			jsonData.password = md5(password);
			$.rest("post", "http://localhost:8888/kx/user/signin", jsonData, function (data) {
				let code = data.code;
				if (code == 200) {
					//登陆成功
					/**
					 * {
                        "code": 200,
                        "msg": "登陆成功",
                        "result": {
                            "user": {
                                "id": 1,
                                "username": "zhangsan",
                                "password": "",
                                "nickname": "张三",
                                "gender": "男",
                                "telephone": "15911135712",
                                "email": "zhangsan@qq.com",
                                "iconLink": "http://xuzhong.vip/icon/zhangsan.jpg"
                            },
                            "token": "eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiLlvKDkuIkiLCJpYXQiOjE2MjY0MTk4MTAsImV4cCI6MTYyNjQyMTYxMCwidXNlciI6IntcImVtYWlsXCI6XCJ6aGFuZ3NhbkBxcS5jb21cIixcImdlbmRlclwiOlwi55S3XCIsXCJpY29uTGlua1wiOlwiaHR0cDovL3h1emhvbmcudmlwL2ljb24vemhhbmdzYW4uanBnXCIsXCJpZFwiOjEsXCJuaWNrbmFtZVwiOlwi5byg5LiJXCIsXCJwYXNzd29yZFwiOlwiXCIsXCJ0ZWxlcGhvbmVcIjpcIjE1OTExMTM1NzEyXCIsXCJ1c2VybmFtZVwiOlwiemhhbmdzYW5cIn0ifQ.rANwleOoTdXAjL39H_9Cz0alww-LvGo5I7dH0jfzDX4"
                        },
                        "ok": true
                    }
					 */
					let token = data.result.token;
					let id=data.result.user.id;
					let username=data.result.user.username;
					let nickname=data.result.user.nickname;
					let gender=data.result.user.gender;
					let telephone=data.result.user.telephone;
					let email=data.result.user.email;
					let iconLink=data.result.user.iconLink;
					//前端开始保存，各种前端被服务器的支持是一致的。
					//前端H5把数据解析放入localStorage里
					//前端Android、iOS把数据放入SQLite里
					localStorage.setItem("token",token);
					localStorage.setItem("id",id);
					localStorage.setItem("username",username);
					localStorage.setItem("nickname",nickname);
					localStorage.setItem("gender",gender);
					localStorage.setItem("telephone",telephone);
					localStorage.setItem("email",email);
					localStorage.setItem("iconLink",iconLink);
					alert("登陆成功");
				} else if (code == 500) {
					//密码错误
					alert("密码错误");
				} else if (code == 501) {
					//账号已经被锁定
					alert("账号已经被锁定");
				}
			});
			return false;
		}
	</script>
</html>